<template>
  <view class="p-[32rpx] bg-[#f5f5f5] min-h-screen">
    <view class="text-[36rpx] font-bold text-center mb-[32rpx]">完整状态系统测试</view>
    
    <!-- 状态切换控制 -->
    <view class="bg-white rounded-[16rpx] p-[24rpx] mb-[24rpx] shadow-sm">
      <view class="text-[28rpx] font-bold mb-[16rpx]">状态控制</view>
      <view class="flex flex-wrap gap-[12rpx] mb-[16rpx]">
        <nut-button 
          v-for="status in Object.values(TASK_STATUS)" 
          :key="status"
          :type="currentTaskStatus === status ? 'primary' : 'default'"
          size="small"
          @click="currentTaskStatus = status"
        >
          {{ getStatusConfig(status, 'task')?.label || status }}
        </nut-button>
      </view>
      
      <view class="text-[24rpx] text-[#666] mb-[16rpx]">
        用户角色：
        <nut-button 
          :type="currentUserRole === USER_ROLE.PUBLISHER ? 'primary' : 'default'"
          size="small"
          @click="currentUserRole = USER_ROLE.PUBLISHER"
        >
          发布方
        </nut-button>
        <nut-button 
          :type="currentUserRole === USER_ROLE.APPLICANT ? 'primary' : 'default'"
          size="small"
          @click="currentUserRole = USER_ROLE.APPLICANT"
        >
          接单人
        </nut-button>
      </view>

      <view class="text-[24rpx] text-[#666]">
        当前状态：{{ getStatusConfig(currentTaskStatus, 'task')?.label || currentTaskStatus }}
        <br>
        用户角色：{{ currentUserRole === USER_ROLE.PUBLISHER ? '发布方' : '接单人' }}
        <br>
        用户状态：{{ getCurrentUserStatusLabel() }}
        <br>
        可用操作：{{ getAvailableActions(currentTaskStatus, currentUserRole, getCurrentUserStatus()).join(', ') }}
      </view>
    </view>

    <!-- 完整状态展示 -->
    <view class="space-y-[24rpx]">
      <!-- 已支付状态 -->
      <view v-if="currentTaskStatus === TASK_STATUS.PAID">
        <view class="text-[28rpx] font-bold mb-[16rpx] text-[#52c41a]">已支付状态测试</view>
        <RewardTaskItem
          :item="getTaskByStatus(TASK_STATUS.PAID, PUBLISHER_STATUS.PUBLISHED)"
          @cancelTask="handleCancelTask"
          @viewApplicants="handleViewApplicants"
          @selectWinner="handleSelectWinner"
          @applyTask="handleApplyTask"
          @cancelApplication="handleCancelApplication"
        />
      </view>

      <!-- 进行中状态 -->
      <view v-if="currentTaskStatus === TASK_STATUS.IN_PROGRESS">
        <view class="text-[28rpx] font-bold mb-[16rpx] text-[#1890ff]">进行中状态测试</view>
        <RewardTaskItem
          :item="getTaskByStatus(TASK_STATUS.IN_PROGRESS, currentUserRole === USER_ROLE.PUBLISHER ? PUBLISHER_STATUS.CONFIRMED : APPLICANT_STATUS.WORKING)"
          @viewProgress="handleViewProgress"
          @confirmCompletion="handleConfirmCompletion"
          @raiseDispute="handleRaiseDispute"
          @submitCompletion="handleSubmitCompletion"
        />
      </view>

      <!-- 已取消状态 -->
      <view v-if="currentTaskStatus === TASK_STATUS.CANCELLED">
        <view class="text-[28rpx] font-bold mb-[16rpx] text-[#999999]">已取消状态测试</view>
        <RewardTaskItem
          :item="getTaskByStatus(TASK_STATUS.CANCELLED)"
          @deleteTask="handleDeleteTask"
        />
      </view>

      <!-- 已完结状态 -->
      <view v-if="currentTaskStatus === TASK_STATUS.COMPLETED">
        <view class="text-[28rpx] font-bold mb-[16rpx] text-[#722ed1]">已完结状态测试</view>
        <RewardTaskItem
          :item="getTaskByStatus(TASK_STATUS.COMPLETED, currentUserRole === USER_ROLE.PUBLISHER ? PUBLISHER_STATUS.SETTLED : APPLICANT_STATUS.SUBMITTED)"
        />
      </view>

      <!-- 有纠纷状态 -->
      <view v-if="currentTaskStatus === TASK_STATUS.DISPUTED">
        <view class="text-[28rpx] font-bold mb-[16rpx] text-[#fa541c]">有纠纷状态测试</view>
        <RewardTaskItem
          :item="getTaskByStatus(TASK_STATUS.DISPUTED, currentUserRole === USER_ROLE.PUBLISHER ? PUBLISHER_STATUS.DISPUTED : APPLICANT_STATUS.DISPUTED)"
          @communicatePlatform="handleCommunicatePlatform"
          @acceptSolution="handleAcceptSolution"
          @rejectSolution="handleRejectSolution"
        />
      </view>
    </view>

    <!-- 接单人状态测试 -->
    <view class="mt-[32rpx] bg-white rounded-[16rpx] p-[24rpx] shadow-sm">
      <view class="text-[28rpx] font-bold mb-[16rpx]">接单人状态测试</view>
      <view class="space-y-[16rpx]">
        <view v-for="status in Object.values(APPLICANT_STATUS)" :key="status">
          <view class="text-[24rpx] font-bold mb-[8rpx]">{{ getStatusConfig(status, 'applicant')?.label || status }}</view>
          <RewardTaskItem
            :item="getApplicantTask(status)"
            @cancelApplication="handleCancelApplication"
            @startTask="handleStartTask"
            @abandonTask="handleAbandonTask"
            @submitCompletion="handleSubmitCompletion"
            @waitConfirmation="handleWaitConfirmation"
            @raiseDispute="handleRaiseDispute"
            @communicatePlatform="handleCommunicatePlatform"
            @acceptSolution="handleAcceptSolution"
            @rejectSolution="handleRejectSolution"
          />
        </view>
      </view>
    </view>

    <!-- 发布方状态测试 -->
    <view class="mt-[32rpx] bg-white rounded-[16rpx] p-[24rpx] shadow-sm">
      <view class="text-[28rpx] font-bold mb-[16rpx]">发布方状态测试</view>
      <view class="space-y-[16rpx]">
        <view v-for="status in Object.values(PUBLISHER_STATUS)" :key="status">
          <view class="text-[24rpx] font-bold mb-[8rpx]">{{ getStatusConfig(status, 'publisher')?.label || status }}</view>
          <RewardTaskItem
            :item="getPublisherTask(status)"
            @cancelTask="handleCancelTask"
            @viewApplicants="handleViewApplicants"
            @selectWinner="handleSelectWinner"
            @viewProgress="handleViewProgress"
            @confirmCompletion="handleConfirmCompletion"
            @raiseDispute="handleRaiseDispute"
            @communicatePlatform="handleCommunicatePlatform"
            @acceptSolution="handleAcceptSolution"
            @rejectSolution="handleRejectSolution"
            @deleteTask="handleDeleteTask"
          />
        </view>
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref, computed } from "vue";
import { Button as nutButton } from "@nutui/nutui-taro";
import Taro from "@tarojs/taro";
import RewardTaskItem from "./RewardTaskItem.vue";
import { 
  TASK_STATUS, 
  APPLICANT_STATUS, 
  PUBLISHER_STATUS, 
  USER_ROLE,
  getStatusConfig,
  getAvailableActions
} from "@/constants/taskStatus";

// 当前状态
const currentTaskStatus = ref(TASK_STATUS.PAID);
const currentUserRole = ref(USER_ROLE.PUBLISHER);

/**
 * 获取当前用户状态
 */
const getCurrentUserStatus = () => {
  if (currentUserRole.value === USER_ROLE.PUBLISHER) {
    switch (currentTaskStatus.value) {
      case TASK_STATUS.PAID: return PUBLISHER_STATUS.PUBLISHED;
      case TASK_STATUS.IN_PROGRESS: return PUBLISHER_STATUS.CONFIRMED;
      case TASK_STATUS.COMPLETED: return PUBLISHER_STATUS.SETTLED;
      case TASK_STATUS.DISPUTED: return PUBLISHER_STATUS.DISPUTED;
      default: return null;
    }
  } else {
    switch (currentTaskStatus.value) {
      case TASK_STATUS.PAID: return APPLICANT_STATUS.APPLIED;
      case TASK_STATUS.IN_PROGRESS: return APPLICANT_STATUS.WORKING;
      case TASK_STATUS.COMPLETED: return APPLICANT_STATUS.SUBMITTED;
      case TASK_STATUS.DISPUTED: return APPLICANT_STATUS.DISPUTED;
      default: return null;
    }
  }
};

/**
 * 获取当前用户状态标签
 */
const getCurrentUserStatusLabel = () => {
  const status = getCurrentUserStatus();
  if (!status) return '无';
  const config = getStatusConfig(status, currentUserRole.value === USER_ROLE.PUBLISHER ? 'publisher' : 'applicant');
  return config?.label || status;
};

/**
 * 根据状态获取任务数据
 */
const getTaskByStatus = (taskStatus, userStatus = null) => {
  return {
    id: 1,
    taskTitle: `${getStatusConfig(taskStatus, 'task')?.label || taskStatus}测试任务`,
    status: getStatusConfig(taskStatus, 'task')?.label || taskStatus,
    taskStatus: taskStatus,
    userRole: currentUserRole.value,
    userStatus: userStatus,
    totalReward: "500.00",
    applyCount: 3,
    desc: `这是一个${getStatusConfig(taskStatus, 'task')?.label || taskStatus}状态的任务，用于测试按钮显示`,
    isUrgent: taskStatus === TASK_STATUS.DISPUTED,
    pay_status: 1,
    deadline: "2024-01-15",
  };
};

/**
 * 获取接单人任务数据
 */
const getApplicantTask = (applicantStatus) => {
  return {
    id: 2,
    taskTitle: `${getStatusConfig(applicantStatus, 'applicant')?.label || applicantStatus}测试任务`,
    status: getStatusConfig(applicantStatus, 'applicant')?.label || applicantStatus,
    taskStatus: TASK_STATUS.PAID, // 基础任务状态
    userRole: USER_ROLE.APPLICANT,
    userStatus: applicantStatus,
    totalReward: "300.00",
    applyCount: 1,
    desc: `接单人状态：${getStatusConfig(applicantStatus, 'applicant')?.label || applicantStatus}`,
    isUrgent: applicantStatus === APPLICANT_STATUS.DISPUTED,
    pay_status: 1,
    deadline: "2024-01-20",
  };
};

/**
 * 获取发布方任务数据
 */
const getPublisherTask = (publisherStatus) => {
  return {
    id: 3,
    taskTitle: `${getStatusConfig(publisherStatus, 'publisher')?.label || publisherStatus}测试任务`,
    status: getStatusConfig(publisherStatus, 'publisher')?.label || publisherStatus,
    taskStatus: TASK_STATUS.PAID, // 基础任务状态
    userRole: USER_ROLE.PUBLISHER,
    userStatus: publisherStatus,
    totalReward: "800.00",
    applyCount: 2,
    desc: `发布方状态：${getStatusConfig(publisherStatus, 'publisher')?.label || publisherStatus}`,
    isUrgent: publisherStatus === PUBLISHER_STATUS.DISPUTED,
    pay_status: 1,
    deadline: "2024-01-25",
  };
};

// 事件处理函数
const handleCancelTask = (task) => {
  Taro.showToast({ title: `取消任务: ${task.taskTitle}`, icon: 'none' });
};

const handleViewApplicants = (task) => {
  Taro.showToast({ title: `查看申请者: ${task.taskTitle}`, icon: 'none' });
};

const handleSelectWinner = (task) => {
  Taro.showToast({ title: `选择中标者: ${task.taskTitle}`, icon: 'none' });
};

const handleViewProgress = (task) => {
  Taro.showToast({ title: `查看进度: ${task.taskTitle}`, icon: 'none' });
};

const handleConfirmCompletion = (task) => {
  Taro.showToast({ title: `确认完成: ${task.taskTitle}`, icon: 'none' });
};

const handleRaiseDispute = (task) => {
  Taro.showToast({ title: `提出纠纷: ${task.taskTitle}`, icon: 'none' });
};

const handleCommunicatePlatform = (task) => {
  Taro.showToast({ title: `联系平台: ${task.taskTitle}`, icon: 'none' });
};

const handleAcceptSolution = (task) => {
  Taro.showToast({ title: `接受方案: ${task.taskTitle}`, icon: 'none' });
};

const handleRejectSolution = (task) => {
  Taro.showToast({ title: `拒绝方案: ${task.taskTitle}`, icon: 'none' });
};

const handleDeleteTask = (task) => {
  Taro.showToast({ title: `删除任务: ${task.taskTitle}`, icon: 'none' });
};

const handleApplyTask = (task) => {
  Taro.showToast({ title: `报名任务: ${task.taskTitle}`, icon: 'none' });
};

const handleCancelApplication = (task) => {
  Taro.showToast({ title: `取消报名: ${task.taskTitle}`, icon: 'none' });
};

const handleStartTask = (task) => {
  Taro.showToast({ title: `开始任务: ${task.taskTitle}`, icon: 'none' });
};

const handleAbandonTask = (task) => {
  Taro.showToast({ title: `放弃任务: ${task.taskTitle}`, icon: 'none' });
};

const handleSubmitCompletion = (task) => {
  Taro.showToast({ title: `提交完成: ${task.taskTitle}`, icon: 'none' });
};

const handleWaitConfirmation = (task) => {
  Taro.showToast({ title: `等待确认: ${task.taskTitle}`, icon: 'none' });
};
</script>
